<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />

		<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
		Remove this if you use the .htaccess -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />	
		<!--<script type='text/javascript' src='http://code.jquery.com/jquery-1.7.2.min.js'></script>-->
		<script type='text/javascript' src='js/jquery.min.js'></script>
	    <script type="text/javascript" charset="utf-8" src="js/cordova-2.3.0.js"></script>
        <script type="text/javascript" charset="utf-8" src="js/social.js"></script>
        <script type="text/javascript" charset="utf-8" src="js/silla.js"></script>
        <script type="text/javascript" src="http://www.google.com/jsapi"></script>
		<script type="text/javascript" src="js/iScroll.js"></script>
		<script type="text/javascript" src="js/pauta.js"></script>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=0.5, maximum-scale=0.5" />
		<title>MiniHome Hagame el Cruce</title>		
		<link rel="stylesheet" type="text/css" href="css/styleMiniHomeHistoria.css" />	
		<link rel="stylesheet" type="text/css" href="css/style.css" />
        <script type="text/javascript">
        
		function toTitleCase(str)
		{
		    return str.replace(/\w\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();});
		}        
			$(document).ready(function() {
			
			
		
				var url='http://www.lasillavacia.com/json/datanews?'+  Math.floor((Math.random()*100000)+1);
				var jqXHR=$.getJSON(url).always(function(data, textStatus, jqXHR){
				var kh=0;
				if (textStatus === 'error') {
					showConfirm();
					window.location.href='index.html'	
				} else {
					setData(data,kh);
   				}
			});
		});
   		
   		function setData(data,kh){
		$.each(data, function(i, field){
			try{ 
			
			var category=field.category;
			if(category.toUpperCase()=="datanews".toUpperCase() && kh<8){
	      		//$("div").append(field.title.toUpperCase() + "<br> ");
	      		
	      		var d = new Date(field.pubDate);
				var hoy=new Date();
				var diasTempo=horasDiferencia(d,hoy);
				
				category=toTitleCase(category);
				var vistas=	field.hits;
	      		var titulo=field.title;
	      		var imagen=field.imagen;
	      		var link=field.permalink;
	      		var desc=field.description;
	      		var autor=field.creator;
	      		function htmlUnescape(value){
				    return String(value)
				        .replace(/&quot;/g, '"')
				        .replace(/&#39;/g, "'")
				        .replace(/&lt;/g, '<')
				        .replace(/&gt;/g, '>')
				        .replace(/&amp;/g, '&');
				}
				
	      		 var hautor=htmlUnescape(autor);				  
				 hautor=$(hautor).html();
	      		var tags=field.tags;
				var hilos=field.hilos;
	      		
				var thediv=$("<div>").attr({
						    'class': "",
						    'id': "feed" + (kh + 1) + "-1"
						}).appendTo("#content");
				
				$("<div>").attr({
						    'class': "seccion"						   
						}).appendTo($(thediv)).html("Hágame el....");
				
				$("<div>").attr({
						    'class': "tempo"						   
						}).appendTo($(thediv)).html(diasTempo);
				$("<div>").attr({
						    'class': "vistas"						   
						}).appendTo($(thediv)).html(vistas);	
				
				$("<div>").attr({						    
				    "class":'fade imagen-historia'
			//	}).appendTo($(thediv)).append("<img class='imagen-historia-"+(kh+1)+"' src='"+imagen+"'/>");
				}).appendTo($(thediv)).append("<img class='imagen-hagameC' src='"+imagen+"'/>");
				
				//fade de imagenes				
					$("<div>").attr({						
					"class":'fade imagen-historia'
					}).appendTo(thediv);		
				
				$("<div>").attr({
						    'class': "tituloTextGrande"						     			   
						}).appendTo($(thediv)).html(titulo.length>70?titulo.substr(0,70)+'...':titulo);
				$("<div>").attr({
						    'class': "autorHome"						   
						}).appendTo($(thediv)).html(hautor);
				
				$(thediv).click(function() {
					try{
						var dir = encodeURI(link.trim());
    					var ref2 = window.open(dir, '_blank', 'location=yes');
    					
					}catch(err){
						alert(err);
					}
				});
				kh++;
				$("div[id^='loading']").remove();		
									
	      }
	      }catch(err)
		  {
		  		alert('err ' + err + 'err.message ' + err.message);
		  }
	    
		});
		
		var div11 = $('#feed1-1').clone(true,true);
		var div21 = $('#feed2-1').clone(true,true);	
		var div31 = $('#feed3-1').clone(true,true);
		var div41 = $('#feed4-1').clone(true,true);
		var div51 = $('#feed5-1').clone(true,true);
		var div61 = $('#feed6-1').clone(true,true);
		var div71 = $('#feed7-1').clone(true,true);
		var div81 = $('#feed8-1').clone(true,true);
		$("<div>").attr("id","feed11-1").appendTo("#content").html(div11.html());
		$('#feed11-1').find("div[class^='fade imagen-historia']").attr("class", "fade imagen-historia-vertical");
		$("<div>").attr("id","feed12-1").appendTo("#content").html(div21.html());
		$('#feed12-1').find("div[class^='fade imagen-historia']").attr("class", "fade imagen-historia-vertical");
		$("<div>").attr("id","feed13-1").appendTo("#content").html(div31.html());
		$('#feed13-1').find("div[class^='fade imagen-historia']").attr("class", "fade imagen-historia-vertical");
		$("<div>").attr("id","feed14-1").appendTo("#content").html(div41.html());
		$('#feed14-1').find("div[class^='fade imagen-historia']").attr("class", "fade imagen-historia-vertical");
		$("<div>").attr("id","feed15-1").appendTo("#content").html(div51.html());
		$('#feed15-1').find("div[class^='fade imagen-historia']").attr("class", "fade imagen-historia-vertical");
		$("<div>").attr("id","feed16-1").appendTo("#content").html(div61.html());
		$('#feed16-1').find("div[class^='fade imagen-historia']").attr("class", "fade imagen-historia-vertical");
		$("<div>").attr("id","feed17-1").appendTo("#content").html(div71.html());
		$('#feed17-1').find("div[class^='fade imagen-historia']").attr("class", "fade imagen-historia-vertical");
		$("<div>").attr("id","feed18-1").appendTo("#content").html(div81.html());
		$('#feed18-1').find("div[class^='fade imagen-historia']").attr("class", "fade imagen-historia-vertical");
		
		
		switch(window.orientation) 
        {
        	case -90:
            case 90:
            	setHomeHorizontal();
                break; 
            default:
            	setHomeVertical();
           	break; 
        } 
		$("div[id^='loading']").remove();
	};	
	function setHomeHorizontal(){
		$('#content').find('*[class=""]').toggleClass('hidden');
		$('#content').find('div:not([class])').addClass("hidden");
		$('#feed1-1').toggleClass('hidden');
		$('#feed2-1').toggleClass('hidden');
		$('#feed3-1').toggleClass('hidden');
		$('#feed4-1').toggleClass('hidden');
		// $('#feed5-1').toggleClass('hidden');
		// $('#feed6-1').toggleClass('hidden');
		// $('#feed7-1').toggleClass('hidden');
		// $('#feed8-1').toggleClass('hidden');
	}
	
	function setHomeVertical(){
		$('#content').find('*[class=""]').toggleClass('hidden');
		$('#content').find('div:not([class])').addClass("hidden");
		$('#feed11-1').toggleClass('hidden');
		$('#feed12-1').toggleClass('hidden');
		$('#feed13-1').toggleClass('hidden');
		$('#feed14-1').toggleClass('hidden');
		$('#feed15-1').toggleClass('hidden');
		$('#feed16-1').toggleClass('hidden');
		$('#feed17-1').toggleClass('hidden');
		$('#feed18-1').toggleClass('hidden');
	}
	
	/*
	function toggleVertical(){
		
			var nota_var=$('#nota_var').html();	
		
			
			if(nota_var=='home'){	
				setHomeVertical();
				$('#nota_var').html("homeVertical");
				
				$('#superior').attr("width","1550px");
				$('#superior').attr("height","100%");
				$('#sillalogo').css("left","748px");
				$('#buscar').css("left","1300px");
				$('#navigation').css("left","940px");
				$('#foot').attr("id","foot-vertical");
				
				
			}else if(nota_var=='homeVertical'){
				// Volver a flip Horizontal
				 
		
				setHomeHorizontal();
				$('#nota_var').html("home");
				
				$('#superior').attr("width","2048px");
				$('#superior').attr("height","100%");
				
				$('#sillalogo').css("left","997px");
				$('#buscar').css("left","1800px");
				$('#navigation').css("left","1450px");
				$('#foot-vertical').attr("id","foot");
				
				
			}			
		}
	*/


	function flipHorizontal(){
		var nota_var=$('#nota_var').html();	

		setHomeHorizontal();
		$('#nota_var').html("home");
				
		$('#superior').attr("width","2048px");
		$('#superior').attr("height","100%");
				
		$('#sillalogo').css("left","997px");
		$('#buscar').css("left","1800px");
		$('#navigation').css("left","1450px");
		$('#foot-vertical').attr("id","foot");
	}

	function flipVertical(){
		var nota_var=$('#nota_var').html();	

		setHomeVertical();
		$('#nota_var').html("homeVertical");
				
		$('#superior').attr("width","1550px");
		$('#superior').attr("height","100%");
		$('#sillalogo').css("left","748px");
		$('#buscar').css("left","1300px");
		$('#navigation').css("left","940px");
		$('#foot').attr("id","foot-vertical");
				
	}

	var originalNavClasses;
		var init = true;	
	
	function toggleNav() {
		    var elem = document.getElementById('navigation_list');
		    var classes = elem.className;
		    if (originalNavClasses === undefined) {
		        originalNavClasses = classes;
		    }
		    elem.className = /expanded/.test(classes) ? originalNavClasses : originalNavClasses + ' expanded';
		}
		
	var checkOrientation = function() {
            switch(window.orientation) 
	        {
	        	case -90:
	            case 90:
	            	$('#loading-vertical').attr("id","loading");
	                $('#block-touch-vertical').attr("id","block-touch");
	                flipHorizontal();
	                
	                break; 
	            default:
	            	$('#loading').attr("id","loading-vertical");
	                $('#block-touch').attr("id","block-touch-vertical");
	                flipVertical();
	                break; 
	        } 
        };
             
        $(window).on('load', checkOrientation).on('orientationchange', checkOrientation);
		
        </script> 


		<!-- iPad/iPhone specific css below, add after your main css >
         <link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="ipad.css" type="text/css" />
         <link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="iphone.css" type="text/css" />
         -->
        <!-- If your application is targeting iOS BEFORE 4.0 you MUST put json2.js from http://www.JSON.org/json2.js into your www directory and include it here -->
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=0.5, maximum-scale=0.5" />
		<title>La Silla Vacia</title>
	</head>
	<body>
		<div id="head">
                <img id="superior" src="img/superior@2x.png"/>
             	<img id="volver" src="img/volver@2x.png" onclick="window.location='index.html'"/>
                <img id="sillalogo" src="img/sillalogo@2x.png"/>
                <img id="buscar" src="img/busqueda@2x.png" onclick="window.location.href='index.html'"/>
                <div class="block-touch"></div>
                <nav id="navigation">
                  <a class="menu_button" href="#footer_nav" onclick="toggleNav(); return false;"></a>
                  <ul id="navigation_list" role="navigation">
                    <li onclick="window.location.href='miniHomeHistoria.html'"><a href="#"  class="item1">HISTORIAS</a></li>
                    <li onclick="open_win('http://www.lasillavacia.com/queridodiario')"><a href="#" class="item2">QUERIDO DIARIO</a></li>
                    <li onclick="window.location.href='miniHomeHagameC.html'"><a href="#"   class="item3">H&Aacute;GAME EL CRUCE</a></li>
                    <li onclick="open_win('http://www.lasillavacia.com/blogs')"><a href="#"  class="item4">EL BLOGUEO</a></li>
                    <li onclick="open_win('http://www.lasillavacia.com/butaca')"><a href="#" class="item3">LA BUTACA</a></li>
                    <li onclick="open_win('http://quienesquien.lasillavacia.com/')"><a href="#" class="item2">QUIÉN ES QUIÉN</a></li>
                    <li onclick="open_win('http://www.proyectorosa.com/blog/')"><a href="#" class="item1">PROYECTO ROSA</a></li>
                 </ul>
                </nav>
        </div>
        <div id="content"></div>
		<div id="foot">
				<img id="inferior" src="img/barra_inferior@2x.png"/>
				<img id="inferiorLive" src="img/botonLIFEoff@2x.png" onclick="window.location.href='vivo.html'"/>
		</div>
		<div id="nota_var" class="hidden">home</div>
	</body>
</html>

		